/**
 * Created by sfr on 2017/10/10.
 */
import React from "react";
import {connect} from "dva";
import { routerRedux } from 'dva/router';
import moment from 'moment';
import {Flex, List, WhiteSpace, Icon} from "antd-mobile";
import styles from './index.less'
const empty = require('is-empty');

class News extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  //==生命周期--页面渲染
  render() {
    return (
      <div className='news' style={{backgroundColor: '#fff'}}>
      {/*党建圈*/}
        <Flex justify='between' align='top' className={styles.newsColumn} onClick={this.handlePartyCircle}>
          <Flex justify='between' align='top'>
            <div className={styles.leftIconBox}>
              <Icon type={require('../../svgs/news/friends.svg')} size='lg' className={styles.leftIcon}/>
            </div>
            <div>
              <div className={styles.newsTitle}>党建圈</div>
              <div className={styles.newsContent}>您有6条未读动态</div>
            </div>
          </Flex>
          <div className={styles.newsRightBox}>
            <div className={styles.newsTime}>
              14:00
            </div>
            <div className={styles.newsNumber}>
              6
            </div>
          </div>
        </Flex>
        {/*新任务*/}
        <Flex justify='between' align='top' className={styles.newsColumn} onClick={this.handleNewTask}>
          <Flex justify='between' align='top'>
            <div className={styles.leftIconBox} style={{backgroundColor: '#56caf5'}}>
              <Icon type={require('../../svgs/news/task.svg')} size='lg' className={styles.leftIcon}/>
            </div>
            <div>
              <div className={styles.newsTitle}>新任务</div>
              <div className={styles.newsContent}>您有6个新任务</div>
            </div>
          </Flex>
          <div className={styles.newsRightBox}>
            <div className={styles.newsTime}>
              14:00
            </div>
            <div className={styles.newsNumber}>
              6
            </div>
          </div>
        </Flex>
        {/*系统消息*/}
        <Flex justify='between' align='top' className={styles.newsColumn} onClick={this.handleSysNews}>
          <Flex justify='between' align='top'>
            <div className={styles.leftIconBox} style={{backgroundColor: '#fcce86'}}>
              <Icon type={require('../../svgs/news/notice.svg')} size='lg' className={styles.leftIcon}/>
            </div>
            <div>
              <div className={styles.newsTitle}>系统消息</div>
              <div className={styles.newsContent}>您有6条系统消息</div>
            </div>
          </Flex>
          <div className={styles.newsRightBox}>
            <div className={styles.newsTime}>
              14:00
            </div>
          </div>
        </Flex>
        {/*会议通知*/}
        <Flex justify='between' align='top' className={styles.newsColumn} onClick={this.handleMeetingNotic}>
          <Flex justify='between' align='top'>
            <div className={styles.leftIconBox} style={{backgroundColor: '#FC86BB'}}>
              <Icon type={require('../../svgs/news/meeting.svg')} size='lg' className={styles.leftIcon}/>
            </div>
            <div>
              <div className={styles.newsTitle}>会议通知</div>
              <div className={styles.newsContent}>15分钟后您有一个会议通知</div>
            </div>
          </Flex>
          <div className={styles.newsRightBox}>
            <div className={styles.newsTime}>
              14:00
            </div>

          </div>
        </Flex>
      </div>
    );
	}
  //==组件所有函数
  //点击党建圈
  handlePartyCircle = () => {
    this.props.dispatch(
      routerRedux.push({
        pathname: `/news/partyCircle`,
        query: {}
      })
    );
  }
  //点击新任务
  handleNewTask = () => {
    this.props.dispatch(
      routerRedux.push({
        pathname: `/news/newTask`,
        query: {}
      })
    );
  }
  //点击系统消息
  handleSysNews = () => {
    this.props.dispatch(
      routerRedux.push({
        pathname: `/news/sysNews`,
        query: {}
      })
    );
  }
  //点击会议通知
  handleMeetingNotic = () => {
    this.props.dispatch(
      routerRedux.push({
        pathname: `/news/meeting`,
        query: {}
      })
    );
  }
}

function mapStateToProps({ information }){
  return {
    information
	};
}
export default connect(mapStateToProps)(News);


